@import "./common/mixin.styl"

html,body
  width 100%
  height 100%
  background rgb(252,252,252)
  overflow-x hidden
  overflow-y auto
  .search-wrapper
    padding-top computedNum(52)
    .head-wrapper
      position fixed
      top 0
      left 0
      height computedNum(52)
      font-size 0
      z-index 9
      background rgb(252,252,252)
      .back-wrapper
        width computedNum(49)
        height computedNum(52)
        background url("../img/back-icon.png") no-repeat center center
        background-size computedNum(8.5) computedNum(15)
        vertical-align top
      .title-wrapper
        width computedNum(267)
        height computedNum(52)
        line-height computedNum(52)
        font-family SimHei
        font-size computedNum(16)
        vertical-align top
      .home-wrapper
        width computedNum(59)
        height computedNum(52)
        vertical-align top
    .search-box-wrapper
      padding computedNum(20)
      font-size 0
      .search-input
        width computedNum(292)
        height computedNum(32)
        vertical-align top
        .book-name
          width computedNum(228)
          height computedNum(32)
          background #f5f5f5
          border none
          outline none
          border-radius computedNum(5)
          padding 0 computedNum(32) 0 computedNum(32)
        .search-icon
          left 0
          top 0
          width computedNum(32)
          height computedNum(32)
          background url("../img/search-icon.png") no-repeat center center
          background-size computedNum(16) auto
        .clear-icon
          right 0
          top 0
          width computedNum(32)
          height computedNum(32)
          background url("../img/close-gray.png") no-repeat center center
          background-size computedNum(13) auto
          display none
      .search-btn
        color #333333
        font-size computedNum(14)
        width computedNum(43)
        height computedNum(32)
        line-height computedNum(32)
    .lately-search-wrapper
      padding 0 computedNum(20)
      display none
      .title
        font-size computedNum(15)
        color #999999
      .lately-search-list
        font-size 0
        padding 0 computedNum(11)
        margin-top computedNum(20)
        li
          vertical-align top
          font-size computedNum(15)
          font-family SimHei
          color #333333
          margin 0 computedNum(20) computedNum(20) 0
    .hot-search-wrapper
      margin-top computedNum(35)
      padding 0 computedNum(20)
      .title
        font-size computedNum(15)
        color #999999
      .hot-search-list
        font-size 0
        margin-top computedNum(20)
        li
          width 50%
          margin-bottom computedNum(25)
          overflow hidden
          text-overflow ellipsis
          white-space nowrap
          font-size computedNum(15)
          &:nth-child(1)
            .order
              background #f86262
          &:nth-child(2)
            .order
              background #f89b62
          &:nth-child(3)
            .order
              background #ffbe58
          .order
            width computedNum(17)
            height computedNum(17)
            text-align center
            line-height computedNum(17)
            margin-right computedNum(7)
            font-family SimHei
            color #ffffff
            background #b7b7b7
    .result-wrapper
      padding 0 computedNum(20)
      display none
      ul
        li
          font-size 0
          margin-bottom computedNum(23)
          &:last-child
            margin-bottom computedNum(0)
          .book-cover
            width computedNum(96)
            height computedNum(122)
          .book-detail
            margin-left computedNum(12)
            width computedNum(227)
            vertical-align top
            .book-name
              font-size computedNum(16)
              margin-bottom computedNum(10)
            .book-desc
              font-size computedNum(13)
              color rgb(102,102,102)
              line-height computedNum(20)
              margin-bottom computedNum(14.5)
              text-align justify
              overflow hidden
              text-overflow ellipsis
              display -webkit-box
              -webkit-box-orient vertical
              -webkit-line-clamp 3
              .status
                color rgb(99,159,241)
                &.finish
                  color rgb(245,186,153)
            .cat-and-click
              .cat-wrapper
                font-size computedNum(11)
                color #999999
                span
                  display inline-block
                  padding computedNum(2) computedNum(3)
                  line-height computedNum(17)
                  border-1px-all(#999999)
                  vertical-align top
                  margin-right computedNum(7)
                  &:after
                    border-radius computedNum(8)
              .click-wrapper
                .click-icon
                  width computedNum(16)
                  height computedNum(22)
                  background url("../img/click-icon.png") no-repeat center center
                  background-size computedNum(16) computedNum(10)
                  vertical-align top
                .click
                  font-size computedNum(11)
                  color #f8a2a2
                  height computedNum(22)
                  line-height computedNum(24)
                  margin-left computedNum(4)

